<template>
  <el-form ref="form" label-width="20%">
    <el-form-item label="审核人">
      <el-input v-model="editApproval.approverName" :disabled="true">
      </el-input>
    </el-form-item>
    <el-form-item label="申请人">
      <el-input v-model="editApproval.creatorName" :disabled="true">
      </el-input>
    </el-form-item>
    <el-form-item label="变更类型">
      <el-select v-model="editApproval.type" :disabled="true">
        <el-option v-for="item in types" :key="item.id" :label="item.name" :value="item.id">
        </el-option>
      </el-select>
    </el-form-item>
    <el-form-item label="变更原因">
      <el-input type="textarea" v-model="editApproval.reason" :disabled="true">
      </el-input>
    </el-form-item>
    <el-form-item label="处理">
      <el-radio-group v-model="state">
        <el-radio-button label="同意"></el-radio-button>
        <el-radio-button label="拒绝"></el-radio-button>
      </el-radio-group>
    </el-form-item>
    <el-form-item label="审核意见">
      <el-input type="textarea" v-model="editApproval.comment" placeholder="请输入审核意见" :disabled='!editable'></el-input>
    </el-form-item>
  </el-form>
</template>

<script>
  import approveUtils from "../../../common/approveUtils"
  let approveUtil = new approveUtils()
  export default {
    name: "ApproveHandle",
    props: ['approval', 'editable'],
    data() {
      return {
        state: '同意',
        editApproval: {
          id: -1,
          creator: '',
          reason: '',
          state: 1,
          comment: ''
        },
        procs: approveUtil.getStatus(),
        types: approveUtil.getTypes()
      };
    },
    created: function() {
      if (this.approval) {
        this.editApproval = this.approval
      }
    },
    methods: {
      getData() {
        if (!this.editApproval.comment) {
          this.editApproval.comment = ''
        }
        if (this.state == '同意') {
          this.editApproval.state = 1
        } else {
          this.editApproval.state = 2
        }
        return this.editApproval
      },
      isDisable() {
        return !this.editable
      }
    }
  };
</script>

